<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('修改项目基本信息')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-project-edit" th:object="${proProject}">
            <input name="projectId" th:field="*{projectId}" type="hidden">
            <div class="form-group">
                <label class="col-sm-3 control-label">WBS号：<i class="fa fa-asterisk text-danger"></i></label>
                <div class="col-sm-8">
                    <input name="WBSNo" th:field="*{WBSNo}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">项目编号：<i class="fa fa-asterisk text-danger"></i></label>
                <div class="col-sm-8">
                    <input name="projectNo" th:field="*{projectNo}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">项目名称：<i class="fa fa-asterisk text-danger"></i></label>
                <div class="col-sm-8">
                    <input name="projectName" th:field="*{projectName}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">项目状态：</label>
                <div class="col-sm-8">
                    <select name="status" class="form-control m-b" th:with="type=${@dict.getType('pro_project_status')}"  th:field="*{status}">
                        <option value="">所有</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}">
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">项目类型：</label>
                <div class="col-sm-8">
                    <select name="proTypeId" class="form-control m-b" th:with="type=${@dict.getType('pro_project_type')}"  th:field="*{proTypeId}">
                        <option value="">所有</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}">
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">项目经理：</label>
                <div class="col-sm-8">
                    <div class="input-group">
                        <input type="hidden" name="pmId"  th:field="*{pmId}"/>
                        <input type="text" class="form-control" id="suggest-pm" name="pmName" th:value="*{pmName}">
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown">
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu">
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">所属部门：</label>
                <div class="col-sm-8">
                    <div class="input-group">
                        <input name="deptId" type="hidden" id="deptId" th:field="*{deptId}"/>
                        <input name="deptName" onclick="selectDeptTree()" id="deptName" type="text" placeholder="请选择归属部门"
                               class="form-control" required autocomplete="off" th:field="*{deptName}">
                        <span class="input-group-addon"><i class="fa fa-search"></i></span>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">项目年度：</label>
                <div class="col-sm-8">
                    <input name="proYear" th:field="*{proYear}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">收入预算：</label>
                <div class="col-sm-8">
                    <input name="income" th:field="*{income}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">支出预算：</label>
                <div class="col-sm-8">
                    <input name="expenditure" th:field="*{expenditure}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">采购预算：</label>
                <div class="col-sm-8">
                    <input name="procurement" th:field="*{procurement}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">毛利率：</label>
                <div class="col-sm-8">
                    <input name="grossMargin" th:field="*{grossMargin}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">外包比例：</label>
                <div class="col-sm-8">
                    <input name="outsourcingRatio" th:field="*{outsourcingRatio}" class="form-control" type="text">
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: bootstrap-suggest-js" />
    <script type="text/javascript">
        var prefix = ctx + "project/project";
        $("#form-project-edit").validate({
            focusCleanup: true,
            rules: {
                WBSNo: "required",
                projectNo: "required",
                projectName: "required",
                grossMargin: {
                    required: true,
                    number: true,
                    max: 100
                },
                outsourcingRatio: {
                    number: true,
                    max: 100
                }
            }
        });

        function submitHandler() {
            if ($.validate.form()) {
                $.operate.save(prefix + "/edit", $('#form-project-edit').serialize());
            }
        }

        // 初始化项目经理选择框
        var pmBsSuggest = $("#suggest-pm").bsSuggest({
            url: ctx + "system/user/getUserList",
            idField: "userId",
            keyField: "userName",
            effectiveFields: ["userName", "phonenumber"],
            effectiveFieldsAlias:{userName: "姓名", phonenumber: "手机"},
            searchFields: ["userName", "phonenumber"]
        }).on('onSetSelectValue', function (e, keyword) {
            console.log('onSetSelectValue: ', keyword);
            if(keyword){
                $("[name=pmId]").val(keyword.id);
            }
        })

        /*选择部门树*/
        function selectDeptTree() {
            var deptId = $("#deptId").val();
            var deptId = $.common.isEmpty(deptId) ? "100" : $("#deptId").val();
            var url = ctx + "system/dept/selectDeptTree/" + deptId;
            var options = {
                title: '选择部门',
                width: "380",
                url: url,
                callBack: doSubmit
            };
            $.modal.openOptions(options);
        }

        function doSubmit(index, layero){
            var tree = layero.find("iframe")[0].contentWindow.$._tree;
            if ($.tree.notAllowParents(tree)) {
                var body = layer.getChildFrame('body', index);
                $("#deptId").val(body.find('#treeId').val());
                $("#deptName").val(body.find('#treeName').val());
                layer.close(index);
            }
        }
    </script>
</body>
</html>